<template>
<div>
	

<el-collapse v-model="activeName" accordion>
  <el-collapse-item
   v-for="(item, index) in distributionSystemList.results"
   :name="index">
   	<template slot="title">
   		{{item.title}} 
   		<el-tag v-if="item.isadopt == '0'" class="ml10" type="success">发展二级需要审核</el-tag>

   		<el-tag v-if="item.isadopt == '1'" class="ml10" type="info">发展二级不需要审核</el-tag>
   	</template>
    
    <el-form 
		:model="item" 
		label-width="180px"
		>
		<el-form-item label="体系名称：" >
			<el-input v-model="item.title" placeholder="请输入体系名称" 
			class="w300"></el-input>
		</el-form-item>

		<el-form-item label="发展二级需要审核：">
		    <el-switch v-model="item.isadopt" 
		    active-value="0" inactive-value="1"></el-switch>
		</el-form-item>

		<el-form-item label="体系描述：" >
			<el-input v-model="item.describe" placeholder="请输入体系描述" ></el-input>
		</el-form-item>

		<el-form-item class="mt10">
		     <el-button type="primary" 
		     @click="save(item)">
		     保存</el-button>
		</el-form-item>

	</el-form>	
  </el-collapse-item>
  
</el-collapse>

<div class="mt20">
	<el-button type="primary" size="medium"  
	@click="createDistributionSystem()">添加一个分销体系</el-button>
</div>

</div>		
</template>

<script>

import { mapGetters } from 'vuex'

export default {
	name: 'distribution',
		data () {
		return {
		  	activeName : -1,
		}
	},

	props: {

	},

	components: {
		
	},

	computed : {
		...mapGetters([
			'distributionSystemList',
		]),
	},

	methods : {
		save (item) {
			let para = {
				code : item.code,
				title : item.title,
				isadopt : item.isadopt,
				describe : item.describe,
				cb : res => {
					this.$notify({
			          title: '成功',
			          message: '保存成功',
			          type: 'success'
			        });
			        this.$store.dispatch('getDistributionSystemList');
				},
				err : res => {
					this.$notify({
			          title: '保存失败',
			          message: res,
			          type: 'error'
			        });
				}
			};

			this.$store.dispatch('updateDistributionSystem', para);
		},

		createDistributionSystem () {
			var obj = {
				title : '',
				isadopt : '0',
				describe : '',
			};

			this.distributionSystemList.results.push(obj);
			this.activeName = this.distributionSystemList.results.length - 1;
		},
	},

	watch : {
	    
	},

	mounted () {
		
		this.$store.dispatch('getDistributionSystemList');
		
	},

}
</script>

<style scoped>

</style>
